<template>
	<view class="inner-tail-back-step2-page-content">
		<easy-select-form-item
			class="forma-item"
			label="起始位置"
			v-model="form.stationCode"
			:list="selectOptions.startPlaces"
			value-field="stationCode"
			label-field="stationName"
		/>
		
		<easy-select-form-item
			class="forma-item"
			label="目标库"
			v-model="form.areaId"
			:list="selectOptions.endAreas"
			value-field="areaId"
			label-field="areaName"
		/>
	</view>
</template>

<script>
import EasySelectFormItem from '@/components/EasySelectFormItem.vue'
import { $alert } from '@/static/js/utils/index.js'
const defaultForm = {
	stationCode:'',
	areaId:''
}
export default {
	name:'innerTailBackStep2PageContent',
	components:{EasySelectFormItem},
	data(){
		return {
			form: {...defaultForm},
			selectOptions:{
				endAreas:[],
				startPlaces:[]
			},
			loaded:false
		}
	},
	methods:{
		show(){
			this.getSelectsOptions((f)=>{
				if (f) {
					this.resetForm()
				}
			})
		},
		resetForm(){
			if (this.selectOptions.startPlaces.length===1) {
				this.form.stationCode = this.selectOptions.startPlaces[0].stationCode
			} else {
				this.form.stationCode = ''
			}
			if (this.selectOptions.endAreas.length===1) {
				this.form.areaId = this.selectOptions.endAreas[0].areaId
			} else {
				this.form.areaId = ''
			}
		},
		getSelectsOptions(callback){
			if (this.loaded) {
				callback && callback(true)
			} else {
				uni.showLoading({
					title: '加载中...',
					mask:true
				});
				Promise.all([
					this.$api.get('TailGetStarPlaceList',{},{block:'innerTail',warn:false,loading:false}),
					this.$api.get('TailGetAreaList',{},{block:'innerTail',warn:false,loading:false})
				]).then(res=>{
					this.selectOptions.startPlaces = res[0] || []
					this.selectOptions.endAreas = res[1] || []
					this.loaded = true
					uni.hideLoading();
					callback && callback(true)
				}).catch(ex=>{
					uni.hideLoading();
					$alert(ex)
					callback && callback(false)
				})
			}
		},
		get(){
			return this.form
		}
	}
}
</script>

<style scoped lang="scss">
.inner-tail-back-step2-page-content{
	height: 100%;
	overflow: auto;
	.forma-item{
		margin-bottom: 24rpx;
	}
}
</style>